<template>
    <div class="health">
        <div class="myhealth">
            <div class="box">
                <span>身高</span>
                <div>
                    <input type="number" v-model="info.tall"/>
                    <span>厘米</span>
                </div>
            </div>
            <div class="box">
                <span>体重</span>
                <div>
                    <input type="number" v-model="info.weight"/>
                    <span>公斤</span>
                </div>
            </div>
            <div class="box onpaddingR" @click="picker(info.bloodType)">
                <span>血型</span>
                <div>
                    <input type="text" placeholder="请选择血型" v-model="info.bloodType" disabled/>
                    <img :src="listUrl">
                </div>
            </div>
            <div class="box">
                <span>常用药物</span>
                <div>
                    <input type="text" v-model="info.medical"/>
                </div>
            </div>
            <div class="box">
                <span>过敏史</span>
                <div>
                    <input type="text" v-model="info.allergyHistory"/>
                </div>
            </div>
            <div class="box">
                <span>就诊医院</span>
                <div>
                    <input type="text" v-model="info.hospital"/>
                </div>
            </div>
        </div>
        <div class="btn">
            <span @click="save">保存</span>
        </div>
    </div>
</template>
<script>
const listUrl = require('@/assets/img/mine/list.png')
import { jsonFilter } from '@/assets/js/util.js'
import { Toast } from 'mint-ui'
export default {
    data () {
        return {
            info: {
                id: '',
                tall: '',
                weight: '',
                bloodType: '',
                medical: '',
                allergyHistory: '',
                hospital: ''
            },
            listUrl: listUrl,
        }
    },
    mounted () {
        let id = this.LocalStorageUtil.getItem('patientId')
        if (id) {
            this.ACApi.getpatientsHealths({
                id: id
            },{
                onSuccess: res => {
                    if (res.data.success) {
                        for (let _key in this.info) {
                            for (let key in res.data.result) {
                                if (_key == key) {
                                    this.info[_key] = res.data.result[key]
                                }
                            }
                        }
                    }
                },
                onFail: error => console.log(error)
            })
        }
    },
    methods: {
        picker (initDate) {
            this.$bloodpicker.create({
                params:{
                    isShow: true,
					initDate: initDate
                }
            },(res)=>{    
                this.info.bloodType = res
            })	
        },
        save () {
            let json = this.info
            if (json.id) {
                this.ACApi.updataPatientsHealths(json,{
                    onSuccess: res => {
                        if (res.success) {
                            Toast({
                                message: '更新成功',
                                iconClass: 'mintui mintui-success',
                                duration: 1000
                            })
                            this.$router.go(-1)
                        }
                    },
                    onFail: error => console.log(error)
                })
            }else {
                json.id = this.LocalStorageUtil.getItem('patientId')
                this.ACApi.patientsHealths(json,{
                    onSuccess: res => {
                        if (res.success) {
                            Toast({
                                message: '提交成功',
                                iconClass: 'mintui mintui-success',
                                duration: 1000
                            })
                            this.$router.go(-1)
                        }
                    },
                    onFail: error => console.log(error)
                })
            }
        }
    }
}
</script>
<style lang="stylus" scoped>
@import '../../../assets/css/layout'
@import '../../../assets/css/var'
.health {
    height 100vh  
    position relative  
}
.myhealth {
    $column()
    .box {
        box-sizing: border-box
        $row()
        $flex-sb()
        $flex-ac()   
        padding 0 .4rem
        height: 1rem
        border-bottom: 1px solid $dWhite
        color: $lBlack
        font-size: $text-font28
        &.onpaddingR {
            padding 0 .12rem 0 .4rem
        }
        div {
            $row()
            $flex-ac()
            color: $lSilver
            input {
                color: $lSilver
                padding .05rem
                text-align: right
            }
            img {
                width: .76rem
                height .75rem
            }
        }
    }
}
.btn {
    $row()
    $flex-vc()
    width: 100%
    position absolute
    bottom .4rem
    span {
        display: inline-block
        width: 4.5rem
        height: .6rem
        background: $green
        color: $White
        border-radius: 5px
        text-align: center
        line-height: .55rem
        &:hover {
            background: $green-7
        }
    }
}
</style>
